import {useSelector, useDispatch} from "react-redux"
import React from 'react'
import {Button} from "antd"
import '@/assets/styles/page1.scss'

const Page1 = () => {

  const dispatch = useDispatch()

  //数据
  const {num} = useSelector((state:RootState)=>({
    num:state.num
  }))
  //点击按钮
  const changeNum = (data:string,event:any) => {
    // console.log(event.target.value,event)  //+/-
    dispatch({type:event.target.value, num})
  }

  return(
    <div className='page1'>
      <p>这是page1页面</p>
      <div className='page1_main'>
        <Button type="primary" shape="circle" value='add' onClick={(event:React.MouseEvent<HTMLElement>)=> changeNum('hahaha',event)}>+</Button>
        <span className='n1'>{num}</span>
        <Button type="primary" shape="circle" value='minus' onClick={(event:React.MouseEvent<HTMLElement>)=> changeNum('hahaha',event)}>-</Button>
      </div>
    </div>
  )
}

export default Page1